<!--
 * @Descripttion: Sustainable
 * @version: 1.0.0
 * @Author: Kenny
 * @Date: 2021-11-01 15:03:03
 * @LastEditors: ~
 * @LastEditTime: 2021-12-02 12:42:22
-->
<!DOCTYPE html>
<html lang="en">

<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
   <style>
      .left {
         float: left;
         width: 100px;
         height: 100px;
         background-color: yellow;
      }

      .ts {
         background-color: green;
         /* 防止字体环绕 */
         /* overflow: hidden; */
      }
   </style>
</head>

<body>
   <p>众所周知，浮动的盒子会遮盖下面的盒子，但是下面盒子里的文字是不会被遮盖的，文字反而还会环绕浮动的盒子。这也是一个比较有趣的特性。</p>
   <div class="left">文字环绕</div>
   <div class="ts">你好你好你好23535你好你好你好你好你好你好你2352345好你好你好你好你好你好你好你好你好你好
      你好你好你好你好你好你好你好你好你好2342你好你好你好你好你好3535你好你好你好你好你好
      你好你好你好你好23525你好你好你好你好你好你好你好你好你好你好你好你好你好你好3425你好你好你好你好你好
   </div>

</body>

</html>